<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>省市级联接口</title>
	<script src="jquery.min.js"></script>
</head>
<body>
	<select name="" id="sheng"></select>
	<select name="" id="shi"></select>

	<script>
		$(function(){
			$.ajax({
				type:"get",
				url:"http://localhost:3000/getProvince",
				data:{},
				dataType:"json",
				success:function(data){
					let str="";
					console.log(data)
					for(let i=0;i<data.length;i++){
						str+="<option>"+data[i].name+"</option>";
					}
					$("#sheng").html(str);
					$("#sheng").change(function(){
						let index=$("#sheng :selected").index()+1;
						console.log(index)
						$.ajax({
							type:"get",
							url:"http://localhost:3000/getCity",
							data:{id:index},
							dataType:"json",
							success:function(data){
								let str="";
								console.log(data)
								for(let i=0;i<data.length;i++){
									str+="<option>"+data[i].name+"</option>";
								}
								$("#shi").html(str)
							}
						})
					})
				}

			})
		})
	</script>
</body>
</html>